<template>
  <div>
    <preHeader></preHeader>
    <div class="top-block"></div>
    <div class="item" v-for="(item,index) in listInfo" :key='index'>
      <p><span class="id">分组ID：{{item.gid}}</span><span class="delete" @click="btnDelete(item.id)">删除</span></p>
      <p><span class="name">分组名：{{item.gid_name}}</span></p>

      <p class="peopleNumber">组员人数：{{item.num}} </p>
      <p class="time">{{new Date(parseInt(item.add_time) * 1000).toLocaleString().replace(/:\d{1,2}$/,' ')}} <span class="update" @click="btnUpdate(1,item.id)">修改</span></p>
    </div>
    <mt-button  @click="btnUpdate(2)">添加</mt-button>
    <div class="bottom-block"></div>
  </div>
</template>

<script>
  import {proxy_gid_list,proxy_gid_del} from '@/api/';
  export default {
    data(){
      return{
        tel:'',
        listInfo:'',
      }
    },
    methods:{
      btnDelete(id){
        this.tel = JSON.parse(localStorage.getItem('tel'));
        proxy_gid_del({tel:this.tel,id}).then(res =>{
          if(res.status == 1){
            this.$messagebox.alert('删除成功！').then(action => {
              if(action == 'confirm'){
                window.location.reload() ;
              }
            });
          }
        })
      },
      btnUpdate(type,id){//1修改2添加
        this.$router.push({
            path:'/upDate',
            query:{
              type,id
            }
          }
        )
      },
      getGroupList(){
        proxy_gid_list({tel:this.usertel}).then(res =>{
          console.log(res)
          this.listInfo = res.data;
        })
      }
    },
    mounted() {
      this.getGroupList();
    }
  }
</script>

<style scoped>
.item{margin: 1em;border-radius: 6px;border: 1px solid #ccc;padding: 10px;font-size: 14px;}
p{margin-bottom: 4px;}
.update,.delete{float: right;font-size: 12px;color: #666;}
.mint-button{bottom: 1em;position: fixed;left: 50%;transform: translateX(-50%);background: #2f3953;color: #fff;width: 150px;border-radius: 20px;}
</style>
